<!DOCTYPE html>
  <html>
  
      <head>
          <meta charset="utf-8">
         <title>HTML5 调用手机摄像头</title>
         <link rel="stylesheet" type="text/css" href="css/common.css">
         <script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
          <style type="text/css">
              .addBorder {
                 border: 1px solid #ccc;
             }
             #imgDiv {
                width: 300px;
                 height: 300px;
             }
             
             #imgContent {
                 width: 100%;
                 height: 100%;
             }
         </style>
     </head>
 
     <body>
 		<div id="app">
 			<div width="225px"><img :src="imgUrl" width="225px" id="img"/></div>
 		</div>
         
         
         <script type="text/javascript">
             
            const app = new Vue({
			  el: '#app',
			  data(){
			  	return {			  	  
				  imgUrl:''
			  	}
			  	
			  },
			  created(){
			  	this.GetQueryString()
//			  	console.log(this.GetQueryString())
			  },
			  methods:{
			  	GetQueryString(param) { //param为要获取的参数名 注:获取不到是为null
		            var currentUrl = window.location.href; //获取当前链接
		            var arr = currentUrl.split("?");//分割域名和参数界限
		            if (arr.length > 1) {
		                arr = arr[1].split("&");//分割参数
		                for (var i = 0; i < arr.length; i++) {
		                    var tem = arr[i].split("="); //分割参数名和参数内容
		                    if (tem[0] == param) {
		                    	console.log(tem[1])
		                        return tem[1];
		                    }
		                }
		                return null;
		            }
		            else {
		                return null;
		            }
		        },
			  }
			})
         </script>
     </body>
 
 </html>